<template>
    <section style="padding: 10px 5px 5px 10px;overflow-y: auto;" :style="{height: tableHeight+'px'}">
        <div style="position: absolute; top: 20px; right: 20px;z-index: 10">
            <el-button size="small" class="el-icon-close" plain @click="closeBtn">
                退出
            </el-button>
            <el-button size="small" type="warning" class="el-icon-printer" v-print="'#printMe'" plain>
                打印
            </el-button>
        </div>
        <el-col :span="24" id="printMe">
            <el-row style="height: 60px;">
                <el-col :span="8" style="padding-left: 40px">
                    <el-image :src="logossy2" fit="contain" style="height: 60px;"></el-image>
                </el-col>
                <el-col :span="8" style="text-align: center">
                    <div style="margin-top: 15px;font-size: 24px;color: black;">成本预估核价单(设计部专业)</div>
                </el-col>
                <el-col :span="8">
                    <div style="margin-left: 45%;margin-top: 40px;font-style: italic;">
                        打印时间{{formatDate(new Date().getTime())}}
                        <br>
                        注意:该核价单只作为研发预估使用
                    </div>
                </el-col>
            </el-row>
            <el-row>
                <table border style="width: 100%;color: black;">
                    <tr style="color: black;">
                        <td>款号：</td>
                        <td>{{printData.editForm.style_number}}</td>
                        <td>主料价格：</td>
                        <td>{{parseFloat(printData.editForm.f69)}}</td>
                        <td rowspan="5" style="width: 30px;text-align: center;">款式图片</td>
                        <td rowspan="5" style="width: 160px;">
                            <el-image :src="printData.editForm.img" fit="cover" style="height: 100%;"></el-image>
                        </td>
                    </tr>
                    <tr style="color: black;">
                        <td>款名：</td>
                        <td>{{printData.editForm.style}}</td>
                        <td>辅料价格：</td>
                        <td>{{parseFloat(printData.editForm.f70)}}</td>
                    </tr>
                    <tr style="color: black;">
                        <td>品名：</td>
                        <td>{{printData.editForm.product_category}}</td>
                        <td>加工费用：</td>
                        <td>{{parseFloat(printData.editForm.f72)}}</td>
                    </tr>
                    <tr style="color: black;">
                        <td>核价用途：</td>
                        <td>{{priceType[printData.editForm.t73_id]}}</td>
                        <td>特殊工艺费用：</td>
                        <td>{{parseFloat(printData.editForm.f71)}}</td>
                    </tr>
                    <tr style="color: black;">
                        <td>绣花费用（BOM成本加价总价）：</td>
                        <td>{{parseFloat(printData.editForm.f63)}}</td>
                        <td>绣花费用（加工项目）：</td>
                        <td>{{parseFloat(printData.editForm.f77)}}</td>
                    </tr>
                    <tr style="color: black;">
                        <td>总成本价含管理费：</td>
<!--                        <td>{{priceTotal.toFixed(2)}}</td>-->
                        <td>{{parseFloat(printData.editForm.f67)}}</td>
                        <td>预估售价（{{printData.rate}}倍率）：</td>
                        <td colspan="3">{{priceAdvanceTotal.toFixed(2)}}</td>
                    </tr>
                </table>
                <table border style="width: 100%;">
                    <tr style="font-weight: bold">
                        <td colspan="10" style="text-align: center;background-color: #dcdee2;font-size: 14px;">主料</td>
                    </tr>
                    <tr>
                        <td>物料名称</td>
                        <td>单位</td>
                        <td>部位</td>
                        <td>供应商</td>
                        <td>价格</td>
                        <td>单耗</td>
                        <td>损耗</td>
                        <td>总价</td>
                    </tr>
                    <tr v-for="(bomItem, index) in printData.editBomList" :key="index" v-if="bomItem.materiel_major_category=='主料'">
                        <td>{{bomItem.materiel}}</td>
                        <td>{{bomItem.materiel_major_unit}}</td>
                        <td>{{bomItem.part}}</td>
                        <td>{{bomItem.supplier}}</td>
                        <td>{{bomItem.price}}</td>
                        <td>{{bomItem.amount}}</td>
                        <td>{{bomItem.f56}}</td>
                        <td>{{parseFloat(parseFloat((Number(bomItem.price)*Number(bomItem.amount)*Number(bomItem.f56)).toFixed(10)).toFixed(4))}}</td>
                    </tr>
                    <tr>
                        <td colspan="7" style="text-align: right">主料总价：</td>
                        <td>{{parseFloat(printData.editForm.f69)}}</td>
                    </tr>
                    <tr style="font-weight: bold">
                        <td colspan="11" style="text-align: center;background-color: #dcdee2;font-size: 14px;">辅料</td>
                    </tr>
                    <tr>
                        <td>物料名称</td>
                        <td>单位</td>
                        <td>部位</td>
                        <td>供应商</td>
                        <td>价格</td>
                        <td>单耗</td>
                        <td>损耗</td>
                        <td>总价</td>
                    </tr>
                    <tr v-for="(bomItem, index) in printData.editBomList" :key="index" v-if="bomItem.materiel_major_category=='辅料'">
                        <td>{{bomItem.materiel}}</td>
                        <td>{{bomItem.materiel_major_unit}}</td>
                        <td>{{bomItem.part}}</td>
                        <td>{{bomItem.supplier}}</td>
                        <td>{{bomItem.price}}</td>
                        <td>{{bomItem.amount}}</td>
                        <td>{{bomItem.f56}}</td>
                        <td>{{parseFloat(parseFloat((Number(bomItem.price)*Number(bomItem.amount)*Number(bomItem.f56)).toFixed(10)).toFixed(4))}}</td>
                    </tr>
                    <tr>
                        <td colspan="7" style="text-align: right">辅料总价：</td>
                        <td>{{parseFloat(printData.editForm.f70)}}</td>
                    </tr>
                    <tr style="font-weight: bold">
                        <td colspan="11" style="text-align: center;background-color: #dcdee2;font-size: 14px;">特殊工艺</td>
                    </tr>
                    <tr>
                        <td>物料名称</td>
                        <td>单位</td>
                        <td>部位</td>
                        <td>供应商</td>
                        <td>价格</td>
                        <td>单耗</td>
                        <td>损耗</td>
                        <td>总价</td>
                    </tr>
                    <tr v-for="(bomItem, index) in printData.editBomList" :key="index" v-if="bomItem.materiel_major_category=='特殊工艺'">
                        <td>{{bomItem.materiel}}</td>
                        <td>{{bomItem.materiel_major_unit}}</td>
                        <td>{{bomItem.part}}</td>
                        <td>{{bomItem.supplier}}</td>
                        <td>{{bomItem.price}}</td>
                        <td>{{bomItem.amount}}</td>
                        <td>{{bomItem.f56}}</td>
                        <td>{{parseFloat(parseFloat((Number(bomItem.price)*Number(bomItem.amount)*Number(bomItem.f56)).toFixed(10)).toFixed(4))}}</td>
                    </tr>
                    <tr>
                        <td colspan="7" style="text-align: right">特殊工艺总价：</td>
                        <td>{{parseFloat(printData.editForm.f71)}}</td>
                    </tr>
                </table>
                <table border style="width: 100%;">
                    <tr style="font-weight: bold">
                        <td colspan="11" style="text-align: center;background-color: #dcdee2;font-size: 14px;">加工项目</td>
                    </tr>
                    <tr>
                        <td>费用类型</td>
                        <td>数量</td>
                        <td>价格</td>
                        <td>总价</td>
                        <td>加价率(%)</td>
                        <td>加价金额</td>
                    </tr>
                    <tr v-for="(item, index) in printData.editItemList" :key="index">
                        <td>
                            <span  v-for="(row, index) in verifyTypeList" :key="index" v-if="item.price_type_id == row.id">
                                {{row.name}}
                            </span>
                        </td>
                        <td>{{item.count}}</td>
                        <td>{{item.price}}</td>
                        <td>{{parseFloat(parseFloat((Number(item.price) * Number(item.count)).toFixed(10)).toFixed(4))}}</td>
                        <td>{{item.f58}}</td>
                        <td>{{parseFloat(parseFloat((Number(item.price) * Number(item.count) * Number(item.f58) / 100).toFixed(10)).toFixed(4))}}</td>
                    </tr>
                    <tr>
                        <td colspan="3" style="text-align: right">加工项目总费用：</td>
                        <td>{{parseFloat(itemPrice)}}</td>
                        <td style="text-align: right">加工项目加价总费用：</td>
                        <td>{{parseFloat(itemPricePlus)}}</td>
                    </tr>
                </table>
            </el-row>
        </el-col>
    </section>
</template>

<script>
import logossy2 from "@/assets/images/logossy2.png";
import {formatDate} from "../../../../libs/tools";

export default {
    name: "printDesign",
    props: {
        verifyTypeList: {
            type: Array,
            default: []
        },
        printData:{
            type: Object,
            default: {}
        },
    },
    data() {
        return {
            logossy2,
            tableHeight: window.innerHeight,
            selectIndex: 0,
            btnLoading: false,
            loading: false,
            page: 1,
            limit: 20,
            total: 0,
            data: [],
            user: {},
            nodeActions: [],
            formatDate,

            priceTotal: 0,
            priceAdvanceTotal: 0,
            itemPrice: 0,
            itemPricePlus:0,
            priceType: {1: "大货核价", 2: "过审核价", 3: "成本预估核价", 4: "实付核价"},
        }
    },
    created() {
        this.user = this.$store.getters.user;
        this.nodeActions = this.user.node_actions[this.$route.meta.id] ? this.user.node_actions[this.$route.meta.id] : [];
    },
    methods: {
        closeBtn(){
            this.$emit("close-btn");
        },
    },
    mounted() {
        console.log(this.printData, this.verifyTypeList)
        this.itemPrice = 0
        this.printData.editItemList.forEach(item => {
            this.itemPrice += parseFloat(parseFloat((Number(item.price) * Number(item.count)).toFixed(10)).toFixed(4));
        });
        this.itemPricePlus = 0;
        this.printData.editItemList.forEach(item => {
            this.itemPricePlus += parseFloat(parseFloat((Number(item.price) * Number(item.count) * Number(item.f58) /100).toFixed(10)).toFixed(4));
        });
        this.priceTotal = Number(this.printData.editForm.f77) + (
            Number(this.printData.editForm.f69)+Number(this.printData.editForm.f70)+Number(this.printData.editForm.f71)+this.itemPrice-Number(this.printData.editForm.f77)
        ) * 1.1;
        //this.priceAdvanceTotal = this.priceTotal * this.printData.rate;
        this.priceAdvanceTotal = Number(this.printData.editForm.f67) * this.printData.rate;
    }
}
</script>

<style scoped>
@page {
    size: auto;
    margin: 0mm;
}
#printMe{
    width: 1100px;
    margin-top: 30px;
    margin-left: 40px;
}

table, th, td {
    border: 1px solid #909399;
    border-collapse: collapse; /* 移除单元格之间的间隔 */
    padding: 6px;
}
</style>
